<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('修改排产单信息')"/>
    <th:block th:include="include :: datetimepicker-css"/>
</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
    <form class="form-horizontal m" id="form-productorder-edit" th:object="${productionOrderVo.productionOrder}">
        <input name="id" th:value="${productionOrderVo.productionOrder.id}" type="hidden">
        <h4 class="form-header h4">排产信息</h4>
        <div class="row">
            <div class="form-group">
                <label class="col-sm-3 control-label is-required">订单号：</label>
                <div class="col-sm-8">
                    <input name="orderNo" th:field="*{orderNo}" class="form-control" type="text" required readonly>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="form-group">
                <label class="col-sm-3 control-label">批次号：</label>
                <div class="col-sm-8">
                    <input name="batchNo" th:value="${productionOrderVo.productionOrder.batchNo}" class="form-control" type="text" >
                </div>
            </div>
        </div>
        <div class="row">
            <div class="form-group">
                <label class="col-sm-3 control-label is-required">生产商品：</label>
                <div class="col-sm-8">
                    <div class="input-group">
                        <input id="goodsId" name="goodsId" type="hidden" th:value="${productionOrderVo.productionOrder.goodsId}">
                        <input id="goodsCode" name="goodsCode" type="hidden" th:value="${productionOrderVo.productionOrder.goodsCode}">
                        <input id="goodsName" name="goodsName" class="form-control" type="text"
                               onclick="selectMainGoods()" th:value="${productionOrderVo.productionOrder.goodsName}" required >
                        <span class="input-group-addon"><i class="fa fa-search"></i></span>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="form-group">
                <label class="col-sm-3 control-label is-required">生产数量：</label>
                <div class="col-sm-8">
                    <input id="goodsNum" name="goodsNum" class="form-control" type="number" th:value="${productionOrderVo.productionOrder.goodsNum}"  required step="0.01">
                </div>
            </div>
        </div>
        <div class="row">
            <div class="form-group">
                <label class="col-sm-3 control-label is-required">商品单位：</label>
                <div class="col-sm-8">
                    <input id="goodsUnit"   name="goodsUnit" class="form-control" type="hidden" th:value="${productionOrderVo.productionOrder.goodsUnit}">
                    <input id="goodsUnitDesc" name="goodsUnitDesc" class="form-control" type="text" th:value="${productionOrderVo.productionOrder.goodsUnitDesc}"  required readonly>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="form-group">
                <label class="col-sm-3 control-label is-required">订单日期：</label>
                <div class="col-sm-8">
                    <div class="input-group date">
                        <input name="orderDate"
                               th:value="${#dates.format(productionOrderVo.productionOrder.orderDate, 'yyyy-MM-dd')}"
                               class="form-control" placeholder="yyyy-MM-dd" type="text" required>
                        <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="form-group">
                <label class="col-sm-3 control-label is-required">要求完成日期：</label>
                <div class="col-sm-8">
                    <div class="input-group date">
                        <input name="requiredDate"
                               th:value="${#dates.format(productionOrderVo.productionOrder.requiredDate, 'yyyy-MM-dd')}"
                               class="form-control" placeholder="yyyy-MM-dd" type="text" required>
                        <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="form-group">
                <label class="col-sm-3 control-label is-required">预计完成日期：</label>
                <div class="col-sm-8">
                    <div class="input-group date">
                        <input name="planDate"
                               th:value="${#dates.format(productionOrderVo.productionOrder.planDate, 'yyyy-MM-dd')}"
                               class="form-control" placeholder="yyyy-MM-dd" type="text" required>
                        <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="form-group">
                <label class="col-sm-3 control-label">来源销售订单：</label>
                <div class="col-sm-8">
                    <div class="input-group">
                        <input id="saleOrderId" name="saleOrderId" type="hidden" th:value="${productionOrderVo.productionOrder.saleOrderId}">
                        <input id="saleOrderNo" name="saleOrderNo" class="form-control" type="text"
                               onclick="selectSaleOrder()" th:value="${productionOrderVo.productionOrder.saleOrderNo}">
                        <span class="input-group-addon"><i class="fa fa-search"></i></span>
                    </div>
                </div>
            </div>
        </div>
        <!--<div class="row">-->
            <!--<div class="form-group">-->
                <!--<label class="col-sm-3 control-label">客户：</label>-->
                <!--<div class="col-sm-8">-->
                    <!--<div class="input-group">-->
                        <!--<input id="customerId" name="customerId" type="hidden"-->
                               <!--th:value="${productionOrderVo.productionOrder.customerId}">-->
                        <!--<input id="customerName" name="customerName" class="form-control" type="text"-->
                               <!--onclick="selectCustomer()" th:value="${productionOrderVo.productionOrder.customerName}">-->
                        <!--<span class="input-group-addon"><i class="fa fa-search"></i></span>-->
                    <!--</div>-->
                <!--</div>-->
            <!--</div>-->
        <!--</div>-->
        <div class="row">
            <div class="form-group">
                <label class="col-sm-3 control-label ">生产优先级：</label>
                <div class="col-sm-8">
                    <select name="batchPriority" class="form-control"
                            th:with="type=${@dict.getType('production_priority')}" required>
                        <option value="">请选择</option>
                        <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"
                                th:field="*{batchPriority}"></option>
                    </select>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="form-group">
                <label class="col-sm-3 control-label">备注：</label>
                <div class="col-sm-8">
                    <textarea name="remark" class="form-control" maxlength="200">[[${productionOrderVo.productionOrder.remark}]]</textarea>
                </div>
            </div>
        </div>

        <h4 class="form-header h4">商品数据</h4>
        <div class="row">
            <div class="col-sm-12">
                <button type="button" class="btn btn-white btn-sm" onclick="addColumn()"><i class="fa fa-plus"> 增加</i>
                </button>
                <button type="button" class="btn btn-white btn-sm" onclick="sub.delRow()"><i class="fa fa-minus"> 删除</i>
                </button>
                <div class="col-sm-12 select-table table-striped">
                    <table id="bootstrap-table"></table>
                </div>
            </div>
        </div>
    </form>

    <div class="row">
        <div class="col-sm-offset-5 col-sm-10">
            <button type="button" class="btn btn-sm btn-primary" onclick="submitHandler()"><i class="fa fa-check"></i>保 存</button>&nbsp;
            <button type="button" class="btn btn-sm btn-danger" onclick="closeItem()"><i class="fa fa-reply-all"></i>关 闭 </button>
        </div>
    </div>
</div>
<th:block th:include="include :: footer"/>
<th:block th:include="include :: datetimepicker-js"/>
<script th:inline="javascript">
    var prefix = ctx + "order/productorder";
    var goodsUnitDatas = [[${@dict.getType('product_unit')}]];//商品单位

    $("#form-productorder-edit").validate({
        focusCleanup: true
    });

    function submitHandler() {
        if ($.validate.form()) {
            $.operate.saveTab(prefix + "/edit", $('#form-productorder-edit').serialize());
        }
    }

    $("input[name='orderDate']").datetimepicker({
        format: "yyyy-mm-dd",
        minView: "month",
        autoclose: true
    });
    $("input[name='requiredDate']").datetimepicker({
        format: "yyyy-mm-dd",
        minView: "month",
        autoclose: true
    });
    $("input[name='planDate']").datetimepicker({
        format: "yyyy-mm-dd",
        minView: "month",
        autoclose: true
    });

    //初始化
    $(function () {
        var data = [[${productionOrderVo.items}]];
        init(data);
    });


    function init(data) {
        // 初始化数据, 可以由后台传过来
        var options = {
            data: data,
            pagination: false,
            showSearch: false,
            showRefresh: false,
            showToggle: false,
            showColumns: false,
            sidePagination: "client",
            columns: [{
                checkbox: true
            },
                {
                    field: 'index',
                    align: 'center',
                    title: "序号",
                    formatter: function (value, row, index) {
                        var columnIndex = $.common.sprintf("<input type='hidden' name='index' value='%s'>", $.table.serialNumber(index));
                        var id = $.common.sprintf("<input type='hidden' name='items[%s].id' value='%s' readonly>", index, row.id);
                        return columnIndex + $.table.serialNumber(index) + id;
                    }
                },
                {
                    field: 'id',
                    align: 'center',
                    title: 'id',
                    visible: false
                },
                {
                    field: 'goodsName',
                    align: 'center',
                    title: '商品名称',
                    formatter: function (value, row, index) {
                        var html = $.common.sprintf("<input class='form-control' type='text' name='items[%s].goodsName' value='%s' readonly>", index, value);
                        var goodsId = $.common.sprintf("<input type='hidden' name='items[%s].goodsId' value='%s'>", index, row.goodsId);//商品id 隐藏域
                        var goodsCode = $.common.sprintf("<input type='hidden' name='items[%s].goodsCode' value='%s'>", index, row.goodsCode);//商品code 隐藏域
                        return html + goodsId + goodsCode;
                    },
                    events: onclickEvent
                },
                {
                    field: 'planNumber',
                    align: 'center',
                    title: '进货数量',
                    formatter: function (value, row, index) {
                        var html = '<input class="form-control" type="text" name="items[' + index + '].planNumber" value="' + value + '" maxlength="6"  required>';
                        return html;
                    },
                },
                {
                    field: 'goodsUnitDesc',
                    align: 'center',
                    title: '单位',
                    formatter: function (value, row, index) {
                        var html = $.common.sprintf("<input class='form-control' type='text' name='items[%s].goodsUnitDesc' value='%s' readonly>", index, value);
                        var goodsUnit = $.common.sprintf("<input type='hidden' name='items[%s].goodsUnit' value='%s'>", index, row.goodsUnit);//商品unit
                        return html+goodsUnit;
                    }
                },
                {
                    field: 'remark',
                    align: 'center',
                    title: '要求',
                    formatter: function (value, row, index) {
                        var html = '<textarea class="form-control"  name="items['+index+'].remark"  maxlength="200">'+value+'</textarea>';
                        return html;
                    },
                }
            ]
        };
        $.table.init(options);
    };

    //新增table行
    function addColumn() {
        var row = {
            id: "",
            goodsId: "",
            goodsName: "",
            goodsUnit: "",
            goodsUnitDesc: "",
            planNumber: "",
            remark: ""
        }
        sub.addRow(row);
    }

    /* 选择销售单 */
    var saleOrderPrefix = ctx + "order/saleorder"

    function selectSaleOrder() {
        var url = saleOrderPrefix + '/selectSaleOrder';
        var options = {
            title: '选择销售订单',
            url: url,
            callBack: doSubmitSaleOrder
        };
        $.modal.openOptions(options);
    }

    function doSubmitSaleOrder(index, layero) {
        var iframeWin = layero.find("iframe")[0].contentWindow.$.table;
        var rows = iframeWin.selectFirstColumns();//调用子页面的方法 获取ID
        if (rows.length == 0) {
            $.modal.alertWarning("请至少选择一条记录");
            return;
        }
        $('#saleOrderId').val(rows.join())
        var orderCode = iframeWin.selectColumns("orderCode").join();//调用子页面的方法 获取ID
        $('#saleOrderNo').val(orderCode)

        $.modal.close(index);
    }


    /* 选择生产商品 */
    var goodsPrefix = ctx + "basic/goods"
    function selectMainGoods() {
        var url = goodsPrefix + '/selectGoods';
        var options = {
            title: '选择商品',
            url: url,
            callBack: doSubmitMainGoods
        };
        $.modal.openOptions(options);
    }

    function doSubmitMainGoods(index, layero){
        var iframeWin = layero.find("iframe")[0].contentWindow.$.table;
        var rows = iframeWin.selectFirstColumns();//调用子页面的方法 获取ID
        if (rows.length == 0) {
            $.modal.alertWarning("请至少选择一条记录");
            return;
        }

        var goodsId=iframeWin.selectColumns("id").join();//调用子页面的方法 获取ID
        var goodsName=iframeWin.selectColumns("goodsName").join();//调用子页面的方法 获取ID
        var goodsUnit=iframeWin.selectColumns("goodsUnit").join();//调用子页面的方法 获取ID
        var goodsUnitDesc = "";//单位描述
        $.each(goodsUnitDatas,function(index,obj){  //index:索引obj:循环的每个元素
            if(obj.dictValue == goodsUnit){
                goodsUnitDesc= obj.dictLabel;
            }
        });
        $.modal.close(index);

        $('#goodsId').val(goodsId);
        $('#goodsName').val(goodsName);
        $('#goodsUnit').val(goodsUnit);
        $('#goodsUnitDesc').val(goodsUnitDesc);

        //赋值子表
        sub.removeAllRow();
        //赋值
        selectBomAidedAjaxList(goodsId);
    }

    //获取子表Bom列表数据
    var bomPrefix = ctx + "order/productbom";
    function selectBomAidedAjaxList(goodsId){
        var data = {"productId":goodsId};
        var productNum=0;
        var config = {
            url: bomPrefix + "/item/selectBomAidedAjaxList",
            type: "post",
            dataType: "json",
            data: data,
            beforeSend: function () {
                $.modal.loading("正在处理中，请稍后...");
            },
            success: function(result) {
                if (result.code == web_status.SUCCESS) {
                    $.each(result.data,function(index,value){
                        productNum=value.delFlag;
                        var row = {
                            id: "",
                            goodsId: value.goodsId,
                            goodsCode: value.goodsCode,
                            goodsName: value.goodsName,
                            goodsUnit: value.goodsUnit,
                            goodsUnitDesc:value.goodsUnitDesc,
                            planNumber: value.planNumber,
                            remark: ""
                        }
                        sub.addRow(row);
                    });
                    //赋值
                    $('#goodsNum').val(productNum);
                }else {
                    $.modal.alertError(result.msg);
                }
                $.modal.closeLoading();
            }
        };
        $.ajax(config)
    }

    /* 选择商品 */
    var goodsPrefix = ctx + "basic/goods"

    function selectShopGoods() {// index:所在行的索引
        var url = goodsPrefix + '/selectGoods';
        var options = {
            title: '选择商品',
            url: url,
            callBack: doSubmitGoods
        };
        $.modal.openOptions(options);
    }

    var orderSeedId;//子表ID
    function doSubmitGoods(index, layero) {
        var iframeWin = layero.find("iframe")[0].contentWindow.$.table;
        var rows = iframeWin.selectFirstColumns();//调用子页面的方法 获取ID
        if (rows.length == 0) {
            $.modal.alertWarning("请至少选择一条记录");
            return;
        }

        var goodsId = iframeWin.selectColumns("id").join();//调用子页面的方法 获取ID
        var goodsCode = iframeWin.selectColumns("goodsCode").join();//调用子页面的方法 获取ID
        var goodsName = iframeWin.selectColumns("goodsName").join();//调用子页面的方法 获取ID
        var goodsUnit = iframeWin.selectColumns("goodsUnit").join();//调用子页面的方法 获取ID
        var planNumber = iframeWin.selectColumns("planNumber").join();//调用子页面的方法 获取ID
        var goodsUnitDesc = "";//单位描述
        $.each(goodsUnitDatas, function (index, obj) {  //index:索引obj:循环的每个元素
            if (obj.dictValue == goodsUnit) {
                goodsUnitDesc = obj.dictLabel;
            }
        });
        var data = $("#" + table.options.id).bootstrapTable('getData');
        var flag = 0;
        $.each(data, function (index, obj) {  //index:索引obj:循环的每个元素
            if (obj.goodsId == goodsId) {
                flag = 1;
                return false; //跳出循环
            }
        });
        if (flag == 1) {
            $.modal.alertWarning("商品已在清单中!");
            return;
        }
        $.modal.close(index);

        var _data = new Object();//某行数据
        _data.goodsId = goodsId;
        _data.goodsCode = goodsCode;
        _data.goodsName = goodsName;
        _data.goodsUnit = goodsUnit;
        _data.goodsUnitDesc = goodsUnitDesc;
        _data.planNumber = planNumber;
        $("#" + table.options.id).bootstrapTable("updateRow", {index: orderSeedId, row: _data});
    }


    /**
     * 选中商品事件
     * */
    window.onclickEvent = {
        'click .form-control': function (e, value, row, index) {
            orderSeedId = index;
            selectShopGoods();
        }
    };
</script>
</body>
</html>